import React, { useState } from 'react'

// 所有的hook必须在函数式组件内部使用
// useState  在函数式组件中定义自己的内部状态
// useState(初始值)   返回一个数组 [当前值, 修改值的方法]

export default function State() {
    const [count, setCount] = useState(200)
    const [num, setNum] = useState(888)
    const [info, setInfo] = useState({
        name: "张三",
        address: "北京",
        age: 28
    })
    return (
        <div>
            State-- { count }
            <button onClick={() => {
                setCount(count + 1)
            }}>+++</button>

            <div>
                Num---{ num }
                <button onClick={() => {
                setNum(999)
            }}>+++</button>
            </div>
            {/* <p>
                姓名: { info.name }
            </p>
            <p>
                年龄: { info.age }
            </p>
            <button onClick={() => {
                setInfo({
                    ...info,
                    age: 38
                })
            }}>+++</button> */}
        </div>
    )
}
